import { vite as vidstack } from "vidstack/plugins";
import mkcert from "vite-plugin-mkcert";
import VitePerfectConsolePlugin from "vite-perfect-console-plugin";
import Icons from "unplugin-icons/vite";
import { FileSystemIconLoader } from "unplugin-icons/loaders";
// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
  css: [
    "@vue-flow/core/dist/style.css",
    "@vue-flow/core/dist/theme-default.css",
    "@vue-flow/controls/dist/style.css",
    "@vue-flow/minimap/dist/style.css",
    "@/assets/stylesheets/reset.css",
    "@/assets/stylesheets/preset.css",
    "vidstack/player/styles/base.css",
  ],
  experimental: {
    clientFallback: false,
    componentIslands: true,
  },
  modules: [
    "@nuxt/ui",
    "@nuxt/devtools",
    "@nuxtjs/google-fonts",
    "@pinia/nuxt",
    "@vueuse/nuxt",
    "@nuxtjs/color-mode",
    "@nuxtjs/sitemap",
    "nuxt-typed-router",
    "dayjs-nuxt",
    "@morev/vue-transitions",
    // "nuxt-shiki",
    "@nuxt/test-utils/module",
    "@pinia-plugin-persistedstate/nuxt",
    "@nuxt/image",
    "nuxt-monaco-editor",
  ],
  devtools: {
    enabled: true,
    vscode: {
      enabled: true,
      // You can set the port to any number between 1000 and 65535
    },
    timeline: {
      enabled: true,
    },
  },
  devServer: {
    port: 5467,
    https: {
      cert: "C:/Users/10057/.vite-plugin-mkcert/cert.pem",
      key: "C:/Users/10057/.vite-plugin-mkcert/dev.pem",
    },
  },
  tailwindcss: {
    cssPath: ["@/assets/stylesheets/tw.css", { injectPosition: "first" }],
    // configPath: "tailwind.config",
    // config: {},
    viewer: true,
    exposeConfig: {
      level: 2,
    },
    editorSupport: {
      autocompleteUtil: true,
    },
  },
  googleFonts: {
    families: {
      "Roboto": true,
      "Josefin+Sans": true,
      "Lato": [100, 300],
      "Raleway": {
        wght: [100, 400],
        ital: [100],
      },
      "Inter": "200..700",
      "Crimson Pro": {
        wght: "200..900",
        ital: "200..700",
      },
    },
  },
  typescript: {
    strict: true,
  },
  colorMode: {
    classSuffix: "",
  },
  runtimeConfig: {
    // 仅在服务器端可用的私有密钥
    apiSecret: "123",
    // 公开的键，也会暴露给客户端
    // public: {
    //   apiBase: "/api",
    // },
  },
  build: {},
  vue: {
    compilerOptions: {
      isCustomElement: tag =>
        tag.startsWith("media-") || tag === "iconify-icon",
    },
  },
  vite: {
    plugins: [
      // Include filter to only check specific files for components and styles.
      vidstack({ include: /components\/player\// }),
      mkcert({
        // savePath: './certs', // save the generated certificate into certs directory
        // force: true, // force generation of certs even without setting https property in the vite config
      }),
      // VitePerfectConsolePlugin({ tip: 'log::' }),

      Icons({
        customCollections: {
          media: FileSystemIconLoader("./node_modules/media-icons/raw"),
        },
      }),
    ],
    server: {
      cors: true,
      headers: {
        "access-control-allow-origin": "*",
      },
    },
  },
  components: {
    dirs: [
      {
        path: "@/components/player",
        pathPrefix: true,
        ignore: ["player-components"],
      },
      // {
      //   path: "@/components/player/player-components",
      //   enabled: false,
      // },
      // 这里必须保留components目录, 否则不会被加载!
      {
        path: "@/components",
        pathPrefix: true,
        ignore: ["player"],
      },
    ],
    // loader: "unplugin-vue-components/nuxt",
  },
  // shiki: {
  //   // 默认值
  //   theme: "github-light",
  //   lang: "javascript",
  //   // 这里仅用作声明
  //   themes: [
  //     "vitesse-light",
  //     "dracula",
  //     "monokai",
  //     "min-dark",
  //     "min-light",
  //     "github-light",
  //   ],
  //   langs: [
  //     "typescript",
  //     "javascript",
  //     "json",
  //     "html",
  //     "css",
  //     "scss",
  //     "yaml",
  //     "markdown",
  //     "vue",
  //   ],
  // },
  vueTransitions: {
    // The same options as in the plugin itself.
    // You will get an autocomplete using Nuxt 3.
  },
  ui: {
    global: true,
    // 这里仅放下载好的icon库
    icons: ["ph", "vscode-icons", "simple-icons", "heroicons"],
  },
  // test: true,
  testUtils: {
    logToConsole: true,
  },
  imports: {
    presets: [],
    imports: [
      {
        name: "default",
        from: "superjson",
        as: "superjson",
      },
    ],
  },
  nitro: {
    storage: {
      // redis: {
      //   driver: 'redis',
      //   /* redis connector options */
      // },
      db: {
        driver: "fs",
        base: "./.data/db",
      },
    },
    devStorage: {
      db: {
        driver: "fs",
        base: "./.data/db",
      },
    },
    experimental: {
      websocket: true,
    },
  },
  sitemap: {
    cacheMaxAgeSeconds: 600,
  },
  site: {
    url: "https://example.com",
  },
  monacoEditor: {
    // These are default values:
    locale: "zh-hans",
    // componentName: {
    //   codeEditor: "MonacoEditor",
    //   diffEditor: "MonacoDiffEditor",
    // },
  },
});
